<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>ECharts map Demo</title>
</head>


<body>
	<div id="map-wrap" style="height: 500px;">
		<!-- 这里以后是地图 -->
	</div>
</body>
<script src="/dep/echarts.min.js"></script>
<script src="/js/jquery-3.3.1.min.js"></script>
<script type="text/javascript">

$(function() {
	$.get('map/json/geometryCouties/441900.json', function (chinaJson) {
		echarts.registerMap('city', chinaJson); // 注册地图
		var mapChart = echarts.init(document.getElementById('map-wrap'));

 			var option = {
			    title: {
			        text: '全国地图',
			        textStyle: {
			            fontSize: 30,
			            color:'#FFF'
			        },
			        x: 'center'
			    },
				geo: {
		  			map: 'city',
		  			//是否滚动放大缩小
		  			roam:true,
		  			itemStyle: {					// 定义样式
		  	            normal: {					// 普通状态下的样式
		  	            	//地图面积颜色
		  	                areaColor: '#FFF',
		  	                //控制地图分界线
		  	                borderColor: '#CD0000'
		  	            }
		  			},
		  			label: {
		  				show: true,
		  				color: '#000',
		  			},
	  	            emphasis: {					// 高亮状态下的样式
	  	            	itemStyle: {
	  	            		areaColor: '#000',
	  	            	},
		  	            label: {
			  				show: true,
			  				color: '#FFF'
				  		}
	  	            }
				},
				//backgroundColor: 'rgba(0,0,0,0)',  		// 透明
	  			backgroundColor: '#404a59',  		// 图表背景色
	  			
	  				
			}  
			

			mapChart.setOption(option);

		});
});



</script>



</html>